
import React from "react";
import { Button, ButtonProps } from "antd";
import { ICapabilityHook } from "../../interfaces/ICapability";
import { Icon } from "@/components/Icon";

export interface ICapabilityButtonProps<T> {

    /** 核心数据 */
    record?: T;

    /** 索引 */
    index?: number;

    /** 按钮标题 */
    title?: string;

    /** 功能 */
    useCapability?: ICapabilityHook;
}

export function CapabilityButton<T = any>(props: ICapabilityButtonProps<T> & ButtonProps) {

    const capabilitys = props.useCapability ? props.useCapability(props.record, props.index) : undefined;

    const icon = React.useMemo(() => {
        if (props.icon) {
            return props.icon;
        } else if (capabilitys?.icon) {
            return <Icon id={capabilitys.icon} />;
        } else {
            return <></>;
        }
    }, [capabilitys?.icon, props.icon])

    if (!capabilitys || capabilitys.hide) return <></>;
    return (
        <>
            <Button
                {...props}
                icon={icon}
                onClick={capabilitys.onStart}
                loading={!!capabilitys.loading}
                disabled={!!capabilitys.disabled}
            >
                {props.title || capabilitys.title}
            </Button>
            {capabilitys.element}
        </>
    )
}